<!doctype html>
<html>

	<head>
		<meta charset="UTF-8">
		<title></title>
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<link href="../../css/mui.min.css" rel="stylesheet" />
		<style type="text/css">
			.mui-bar {
				box-shadow: none
			}
			
			.mui-title {
				color: #208AFE;
				font-size: 18px;
			}
			
			.mui-icon span {
				font-size: 16px;
			}
			
			.del-div {
				font-size: 16px;
				position: absolute;
				right: 15px;
				bottom: 10px;
				color: #208AFE;
			}
			
			.mui-content {
				width: 90%;
				margin-left: 5%;
				background-color: white;
				display: none;
			}
			
			.huo-div {
				margin-top: 5%;
			}
			
			.huo-p {
				color: black;
				font-size: 95%;
			}
			
			.money-p {
				color: red;
			}
			
			.arrea-p {
				color: black;
			}
			
			.go-area {
				color: #208AFE;
				float: right;
				margin-right: 10%;
			}
			
			.renwu-dv {
				padding-left: 6%;
				border-left: 5px solid #208AFE;
				border-radius: 2px;
			}
			
			.text1 {
				font-size: 80%;
				color: #98989C;
				display: block;
			}
			
			.padd-div {
				margin-top: 4%;
			}
			
			.write-text {
				font-size: 80%;
				border-color: #EDEDED;
				padding-left: 0;
				border: 0
			}
			
			.fiends-div {
				width: 100%;
				background-color: white;
				padding: 3% 0;
				font-size: 100%;
				display: flex;
				flex-wrap: nowrap;
			}
			
			.fiends-div .friend-heddimg {
				width: 18%;
				margin-right: 5%;
				margin-left: 5%;
				height: 10%;
			}
			
			.fiends-div .agree-button {
				padding: 0;
				position: absolute;
				right: 3%;
				background-color: #077DFF;
				border: 0;
				padding: 0.5% 3%;
				font-size: 95%;
				color: #FFFFFF;
				z-index: 99;
			}
			
			.fiends-div .yagree-div {
				position: absolute;
				right: 5%;
				background-color: #FFFFFF;
				font-size: 80%;
				border-radius: 3px;
				color: #077DFF;
			}
			
			.card-div {
				display: none;
			}
			
			.conttext-div {
				display: flex;
				flex-wrap: wrap;
				padding: 0;
			}
			
			.conttext-div .div1 {
				display: block;
				width: 90%;
				padding: 0;
				list-style: none;
			}
			
			.div2 {
				color: #A9A9A9;
				font-size: 80%;
			}
			
			.div2 .img1 {
				width: 6%;
				position: absolute;
				right: 5%;
			}
			
			.div2 .img2 {
				width: 6%;
				position: absolute;
				margin-left: 3%;
			}
			
			.bottom-div {
				width: 100%;
				position: fixed;
				bottom: 0;
				display: flex;
				background-color: #208AFE;
			}
			
			.divv {
				width: 50%;
			}
			
			.bottom-div-item {
				width: 100%;
				display: flex;
				align-items: center;
				justify-content: center;
				color: #FFFFFF;
			}
			
			.bottom-div-item1 {
				border-right: 1px solid #FFFFFF;
			}
			
			.bottom-div-item img {
				width: 12%;
			}
		</style>
	</head>

	<body style="background-color: #FFFFFF;">
		<header class="mui-bar mui-bar-nav" id="header">
			<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"><span>返回</span></a>
			<h1 class="mui-title">详情</h1>
			<div class="del-div" id="del-div">删除</div>
		</header>

		<div class="mui-content" id="mui-content">
			<div class="huo-div">
				<p class="huo-p" id="title"></p>
			</div>
			<p class="money-p" id="price"></p>
			<p class="arrea-p" id="area"></p>
			<div class="renwu-dv">
				<p class="huo-p">任务要求</p>
			</div>
			<text class='text1'>结算周期：<text id="cycle"></text></text>
			<text class='text1'>招聘人数：<text id="personnum"></text></text>
			<text class='text1'>性别要求：<text id="sexneed"></text></text>
			<div class="renwu-dv padd-div">
				<p class="huo-p">详细内容</p>
			</div>
			<textarea name="" class="write-text" id="txtContent" rows="2" cols="30" disabled="true" placeholder="还没有详细内容哦..." onkeyup="ResizeTextarea()"></textarea>
			<div class="renwu-dv">
				<p class="huo-p">工作时间</p>
			</div>
			<text class='text1'>起始时间：<text id="starttime"></text></text>
			<text class='text1'>结束时间：<text id="endtime"></text></text>
			<div class="renwu-dv padd-div">
				<p class="huo-p">联系方式</p>
			</div>

			<div class="fiends-div" id="fiends-div">
				<img src="" class="friend-heddimg" id="headmigg" />
				<div class="conttext-div">
					<div class="div1" id="nickname">

					</div>
					<div class="div1 div2">
						手机号：<text id="tel"></text>
					</div>
					<div class="div1 div2">
						账号：<text id="card"></text>
					</div>
				</div>
			</div>
		</div>

		<script src="../../js/mui.min.js"></script>
		<script src="../../js/immersed.js"></script>
		<script type="text/javascript">
			mui.init();
			mui.plusReady(function() {
				starbar();
				plus.navigator.setStatusBarStyle('dark');

				var viewwidth = document.body.clientWidth;
				document.getElementById('headmigg').style.height = "-webkit-calc(" + viewwidth * 0.18 * 0.9 + "px)";

				mui.ajax('https://www.lunyuwang.com/taskController/queryTaskDetail', {
					data: {
						lytask_Idd: plus.webview.currentWebview().idd
					},
					crossDomain: true, //强制使用5+跨域
					dataType: 'json', //服务器返回json格式数据
					type: 'get', //HTTP请求类型
					timeout: 10000, //超时时间设置为10秒；
					//processData: false,
					headers: {
						'Content-Type': 'application/x-www-form-urlencoded'
					},
					success: function(data) {
						var tasktext = data.taskDetail;
						var cardtext = data.taskUser;
						document.getElementById('title').textContent = tasktext.lytask_Title;
						document.getElementById('price').textContent = tasktext.lytask_Pay;
						document.getElementById('area').textContent = tasktext.lytask_Adress;
						document.getElementById('cycle').textContent = tasktext.lytask_Cycle;
						document.getElementById('personnum').textContent = tasktext.lytask_Number;
						document.getElementById('sexneed').textContent = tasktext.lytask_Sex;
						document.getElementById('txtContent').value = tasktext.lytask_Text;
						document.getElementById('starttime').textContent = tasktext.lytask_Start;
						document.getElementById('endtime').textContent = tasktext.lytask_End;
						document.getElementById('headmigg').src = cardtext.lyuser_FacePath;
						document.getElementById('nickname').textContent = cardtext.lyuser_NickName;
						document.getElementById('tel').textContent = cardtext.lyuser_Tel;
						document.getElementById('card').textContent = cardtext.lyuser_Card;
						plus.nativeUI.closeWaiting();
						document.getElementById('mui-content').style.display = "block";

					},
					error: function(xhr, type, errorThrown) {
						mui.toast('发布异常!')
					}
				})

				document.getElementById('del-div').addEventListener('tap', function() {
					mui.confirm('确认删除？', function(e) {
						if(e.index == 0) {
							mui.ajax('https://www.lunyuwang.com/taskController/deleteMyTask', {
								data: {
									lytask_Idd: plus.webview.currentWebview().idd
								},
								crossDomain: true, //强制使用5+跨域
								dataType: 'json', //服务器返回json格式数据
								type: 'get', //HTTP请求类型
								timeout: 10000, //超时时间设置为10秒；
								//processData: false,
								headers: {
									'Content-Type': 'application/x-www-form-urlencoded'
								},
								success: function(data) {
									if(data.state == 1) {
										mui.toast("删除成功!");
										var preView = plus.webview.currentWebview().opener(); //触发上一个页面刷新图片事件
			                         	mui.fire(preView,'del_thetask',{ 
			                         		iid: plus.webview.currentWebview().idd
			                         	}); 
			                         	mui.back();
									} else {
										mui.toast("删除异常,请重新操作");
									}
								},
								error: function(xhr, type, errorThrown) {
									mui.toast('删除异常!')
								}
							})
						}
					})
				})
			})

			//textarea自适应说说高度
			function ResizeTextarea() {
				// 最小高度  
				var minRows = 2;
				// 最大高度，超过则出现滚动条  
				var maxRows = 100;
				var t = document.getElementById('txtContent');
				if(t.scrollTop == 0) t.scrollTop = 1;
				while(t.scrollTop == 0) {
					if(t.rows > minRows)
						t.rows--;
					else
						break;
					t.scrollTop = 1;
					if(t.rows < maxRows)
						t.style.overflowY = "hidden";
					if(t.scrollTop > 0) {
						t.rows++;
						break;
					}
				}
				while(t.scrollTop > 0) {
					if(t.rows < maxRows) {
						t.rows++;
						if(t.scrollTop == 0) t.scrollTop = 1;
					} else {
						t.style.overflowY = "auto";
						break;
					}
				}
			}
		</script>
	</body>

</html>